<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动定位</title>
		<!-- css5个定位
		    浮动定位 ---  float属性
			概念: 让元素脱离文档流
			      使浮动的元素可以向左 右
			  通常用于: 左右布局 图片与文本环绕的方式
			  注意: 一旦元素加了浮动 元素就会变成块级元素(可以设置宽高)
			  属性值: none   默认(不浮动)
			         left    左浮动
					 right   右浮动
					 
					 clear   清除浮动
					 left    去左
					 right   去右
					 both    去除左右
			
			相对定位
			绝对定位
			普通流(文档流)定位 ---按照元素分类来定位
			行元素与行元素   同一行
			块与块          两行
			块与行内块       一行
			
			固定定位 ---元素定死在页面上
		主要功能: 页面元素布局-->
		
		
		<link rel="stylesheet" href="css/定位.css" />
	
		
	</head>
	<body>
		<div class="d1">1</div>
		<div class="d2">2</div>
		<div class="d3">3</div>
		<div class="d4">4</div>
	</body>
</html>